﻿@{
  ViewBag.Title = "Mvc Form Helper Extensions";
}

<h3 class="keep-center">Mvc Form Helper Extensions</h3>

<div class="row-fluid">
  <div class="span6">
    <div class="row-fluid">
      <div class="span3">
        <strong>Assembly</strong>
      </div>
      <div class="span4">
        WebExtras.Mvc.dll
      </div>
    </div>
    <div class="row-fluid">
      <div class="span3">
        <strong>Namespace</strong>
      </div>
      <div class="span4">
        WebExtras.Mvc.Core
      </div>
    </div>
  </div>
  <div class="span6">
    <div class="span3">
      <strong>Dependancies</strong>
    </div>
    <div class="span6">
      <ul class="dependancies">
        <li>Appropriate third party libraries</li>
        <li>webextras.bootstrap.css</li>
      </ul>
    </div>
  </div>
</div>

<div class="well">
  <h4>Buttons</h4>
  <p>Markup</p>
  <pre><code>
  @@Html.Button(EButton.Regular, "Regular button")
  </code></pre>
  <p>Output</p>
  <div class="content">
    @Html.Button(EButton.Regular, "Regular Button")
  </div>
  <p>All available extensions</p>
  <pre><code>
  @@Html.Button(type, text, htmlAttributes)                     <span class="comment">// type - can be Regular, Submit or Reset</span>
  @@Html.Button(type, text, onclick, htmlAttributes)            <span class="comment">// onclick - javascript onclick event</span>
  </code></pre>
</div>

<div class="well">
  <h4>Checkbox Group</h4>
  <p>Markup</p>
  <pre><code>
  @@Html.CheckBoxGroup("my checkbox group", new CheckBox[] {
    new CheckBox("checkbox 1", "1"),
    new CheckBox("checkbox 2", "2"),
    new CheckBox("checkbox 3", "3"),
    new CheckBox("checkbox 4", "4"),
    new CheckBox("checkbox 5", "5"),                  <span class="comment">// Note that by default 5 checkboxes will be shown per line</span>
    new CheckBox("checkbox 6", "6"),
    new CheckBox("checkbox 7", "7"),
    new CheckBox("checkbox 8", "8"),
    new CheckBox("checkbox 9", "9"),
    new CheckBox("checkbox 10", "10"),
  })
  </code></pre>
  <p>Output</p>
  <div class="content">
    <span class="comment">// The rendered table will have a CSS class <span class="highlight">.checkbox-group</span> applied 
      which you can use to control styling</span>
    <br />
    <br />
    @Html.CheckBoxGroup("my checkbox group", new CheckBox[] {
      new CheckBox("checkbox 1", "1"),
      new CheckBox("checkbox 2", "2"),
      new CheckBox("checkbox 3", "3"),
      new CheckBox("checkbox 4", "4"),
      new CheckBox("checkbox 5", "5"),
      new CheckBox("checkbox 6", "6"),
      new CheckBox("checkbox 7", "7"),
      new CheckBox("checkbox 8", "8"),
      new CheckBox("checkbox 9", "9"),
      new CheckBox("checkbox 10", "10"),
    })
  </div>
  <p>All available extensions</p>
  <pre><code>
  @@Html.CheckBoxGroup(groupname, checkboxes, htmlAttributes)
  @@Html.CheckBoxGroup(groupname, checkboxes, boxesPerLine, htmlAttributes)
  </code></pre>
</div>

<div class="well">
  <h4>RadioButton Group</h4>
  <p>Markup</p>
  <pre><code>
  @@Html.RadioButtonGroup("my radio group", new RadioButton[] {
    new RadioButton("radiobutton 1", "1"),
    new RadioButton("radiobutton 2", "2"),
    new RadioButton("radiobutton 3", "3"),
    new RadioButton("radiobutton 4", "4"),
    new RadioButton("radiobutton 5", "5"),                  <span class="comment">// Note that by default 5 radio buttons will be shown per line</span>
    new RadioButton("radiobutton 6", "6"),
    new RadioButton("radiobutton 7", "7"),
    new RadioButton("radiobutton 8", "8"),
    new RadioButton("radiobutton 9", "9"),
    new RadioButton("radiobutton 10", "10"),
  })
  </code></pre>
  <p>Output</p>
  <div class="content">
    <span class="comment">// The rendered table will have a CSS class <span class="highlight">.radiobutton-group</span> applied 
      which you can use to control styling</span>
    <br />
    <br />
    @Html.RadioButtonGroup("my radio group", new RadioButton[] {
      new RadioButton("radiobutton 1", "1"),
      new RadioButton("radiobutton 2", "2"),
      new RadioButton("radiobutton 3", "3"),
      new RadioButton("radiobutton 4", "4"),
      new RadioButton("radiobutton 5", "5"),
      new RadioButton("radiobutton 6", "6"),
      new RadioButton("radiobutton 7", "7"),
      new RadioButton("radiobutton 8", "8"),
      new RadioButton("radiobutton 9", "9"),
      new RadioButton("radiobutton 10", "10"),
    })
  </div>
  <p>All available extensions</p>
  <pre><code>
  @@Html.RadioButtonGroup(groupname, radiobuttons, htmlAttributes)
  @@Html.RadioButtonGroup(groupname, radiobuttons, buttonsPerLine, htmlAttributes)
  </code></pre>
</div>